<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<title>Document</title>
		<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
		<!-- Font Awesome 图标 -->
		<link rel="stylesheet" href="fontawesome/css/all.min.css">
		<link rel="stylesheet" href="css/search.css" />
		<link rel="stylesheet" href="css/base.css" />
	</head>
	<body>
	<!-- 导航栏 -->
	<div class="container-fluid fixed-top navbar-custom" id="top">
		<nav class="navbar navbar-expand-lg" role="navigation">
			<div class="container">
				<a href="index.jsp" class="navbar-brand navbar-b-custom font-logo">
						<img src="img/headLogo.png" alt="" id="headImage">
					</a>

				<!-- 搜索条 -->
				<form action="searchGoodsDo" method="get">
						<div class="d-flex position-absolute start-50 translate-middle-x serchBar">
							<input  name="searchName" type="text" class="form-control1 form-control-sm" id="searchBar" />
							<button class="btn btn-primary ms-2 serchBut" id="searchBtn">搜索</button>
						</div>
					</form>

				<!-- 右侧用户信息栏 -->
				<ul class="navbar-nav mb-2 mb-lg-0 align-items-center">
					<li class="nav-item d-flex align-items-center">
					<input type="hidden" class="userid" value=${sessionScope.logInUser.userid}>
					<img src=${sessionScope.logInUser.headimg} alt="用户头像"
						class="headimg align-self-center"></li>
					<li class="nav-item"><a href="mineInformation.jsp"
						class="nav-link navbar-a-custom">我的主页</a></li>
					<li class="nav-item"><a href="mychartingRecords.jsp"
						class="nav-link navbar-a-custom">消息</a></li>
					<li class="nav-item"><a href="order.jsp"
						class="nav-link navbar-a-custom">我的订单</a></li>
					<li class="nav-item"><a href="userLogOut" 
						class="nav-link navbar-a-custom">退出</a></li>
				</ul>
			</div>
		</nav>
	</div>
	
		<!-- 中部信息区 -->
		<div class="container-fluid"  id="middle">
			<div class="container middle">
				<div class="options container">
					<div class="dropdown mb-4" style="display: inline-block;">
					    <button class="btn btn-secondary dropdown-toggle btn-style" type="button" id="animatedDropdown" data-bs-toggle="dropdown" aria-expanded="false">
					        <strong>综合</strong>
					    </button>
					    <ul class="dropdown-menu" aria-labelledby="animatedDropdown">
					        <li><a class="dropdown-item" href="#">综合</a></li>
					        <li><a class="dropdown-item" href="#">离我最近</a></li>
					        <li><a class="dropdown-item" href="#">信用排序</a></li>
							<li><a class="dropdown-item" href="#">最近添加</a></li>
					        <li><hr class="dropdown-divider"></li>
					    </ul>
					</div>
					<button class="btn btn-secondary btn-style">
					    <strong>最近降价</strong>
					</button>
					<div class="dropdown mb-4" style="display: inline-block;">
						<button class="btn btn-secondary dropdown-toggle btn-style" type="button" id="animatedDropdown" data-bs-toggle="dropdown" aria-expanded="false">
						    <strong>价格排序</strong>
						</button>
						<ul class="dropdown-menu" aria-labelledby="animatedDropdown">
						    <li><a class="dropdown-item" href="#">价格从高到低</a></li>
						    <li><a class="dropdown-item" href="#">价格从低到高</a></li>
						    <li><hr class="dropdown-divider"></li>
						</ul>
					</div>
					<div class="tagBox">
						<p><input type="checkbox" name="" id="">个人闲置</p> 
						<p><input type="checkbox" name="" id="">包邮</p> 
						<p><input type="checkbox" name="" id="">全新</p> 
						<p><input type="checkbox" name="" id="">转卖</p> 
					</div>
				</div>
				<div class="goods container">
					<ul class="row" style="list-style: none;padding-left: 0px;">
						<li class="col-md-2 goods-info">
							<a href="">
								<img src="img/065441957a3bd280ba6fc94be73c0b05.jpg" alt="">
								<p>商品名</p>
								<p><strong style="color: red;">商品价格</strong><small style="color: rgba(0, 0, 0, 0.4);">  其他信息</small></p>
								<p><img src="img/headimg_def.jpg" alt="" /> <small style="color: rgba(0, 0, 0, 0.8);">卖家昵称</small></p>
							</a>
						</li>
						<li class="col-md-2 goods-info">
							<a href="">
								<img src="img/065441957a3bd280ba6fc94be73c0b05.jpg" alt="">
								<p>商品名</p>
								<p><strong style="color: red;">商品价格</strong><small style="color: rgba(0, 0, 0, 0.4);">  其他信息</small></p>
								<p><img src="img/headimg_def.jpg" alt="" /> <small style="color: rgba(0, 0, 0, 0.8);">卖家昵称</small></p>
							</a>
						</li>
						<li class="col-md-2 goods-info">
							<a href="">
								<img src="img/065441957a3bd280ba6fc94be73c0b05.jpg" alt="">
								<p>商品名</p>
								<p><strong style="color: red;">商品价格</strong><small style="color: rgba(0, 0, 0, 0.4);">  其他信息</small></p>
								<p><img src="img/headimg_def.jpg" alt="" /> <small style="color: rgba(0, 0, 0, 0.8);">卖家昵称</small></p>
							</a>
						</li>
						<li class="col-md-2 goods-info">
							<a href="">
								<img src="img/065441957a3bd280ba6fc94be73c0b05.jpg" alt="">
								<p>商品名</p>
								<p><strong style="color: red;">商品价格</strong><small style="color: rgba(0, 0, 0, 0.4);">  其他信息</small></p>
								<p><img src="img/headimg_def.jpg" alt="" /> <small style="color: rgba(0, 0, 0, 0.8);">卖家昵称</small></p>
							</a>
						</li>
						<li class="col-md-2 goods-info">
							<a href="">
								<img src="img/065441957a3bd280ba6fc94be73c0b05.jpg" alt="">
								<p>商品名</p>
								<p><strong style="color: red;">商品价格</strong><small style="color: rgba(0, 0, 0, 0.4);">  其他信息</small></p>
								<p><img src="img/headimg_def.jpg" alt="" /> <small style="color: rgba(0, 0, 0, 0.8);">卖家昵称</small></p>
							</a>
						</li>
						<li class="col-md-2 goods-info">
							<a href="">
								<img src="img/065441957a3bd280ba6fc94be73c0b05.jpg" alt="">
								<p>商品名</p>
								<p><strong style="color: red;">商品价格</strong><small style="color: rgba(0, 0, 0, 0.4);">  其他信息</small></p>
								<p><img src="img/headimg_def.jpg" alt="" /> <small style="color: rgba(0, 0, 0, 0.8);">卖家昵称</small></p>
							</a>
						</li>
					</ul>
				</div>
			</div>
		</div>
			
		<!-- 底部区 -->
		<footer class="container-fluid bottom p-3 mt-auto" id="footer">
			<div class="font-logo infoLeft mx-auto">
				<strong>复焕集 </strong>旧物也能焕然一新的二手市场。
			</div>
			<div class="container">
				<div class="d-flex flex-wrap justify-content-between">
					<ul class="footer-links mb-2 mb-lg-0 flex-grow-1 px-3 text-center">
						<strong>关于我们</strong>
						<li><a href="">公司介绍</a></li>
						<li><a href="">团队介绍</a></li>
						<li><a href="">媒体报道</a></li>
						<li><a href="">加入我们</a></li>
					</ul>
					<ul class="footer-links mb-2 mb-lg-0 flex-grow-1 px-3 text-center">
						<strong>帮助中心</strong>
						<li><a href="">新手入门</a></li>
						<li><a href="">交易流程</a></li>
						<li><a href="">常见问题</a></li>
						<li><a href="">安全指南</a></li>
					</ul>
					<ul class="footer-links mb-2 mb-lg-0 flex-grow-1 px-3 text-center">
						<strong>规则中心</strong>
						<li><a href="">用户协议</a></li>
						<li><a href="">隐私政策</a></li>
						<li><a href="">交易规则</a></li>
						<li><a href="">社区公约</a></li>
					</ul>
					<ul class="footer-links mb-2 mb-lg-0 flex-grow-1 px-3 text-center">
						<strong>联系我们</strong>
						<li><a href="">客服电话：400-114-514</a></li>
						<li><a href="">商务合作：bd@fuhuanji.com</a></li>
						<li><a href="">举报反馈：report@fuhuanji.com</a></li>
					</ul>
				</div>
			</div>
		</footer>
	</body>
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
	<script src="js/jquery.js">
	</script>
	<script>
	</script>
</html>